<template>
	<view  class="pages">
		<my-header bgColor="bg-gradual-blue" :isBack="true" :isHome="isHome">
			<block slot="backText">返回</block>
			<block slot="content">老黄历</block>
		</my-header>
		<view class="wrap bg-grey light"> 
            <view class="yinli row bg-grey">{{huangli.yinli}}
                <picker mode="date" :value="date" start="2015-09-01"  @change="DateChange">
                    <image class="icon" src="/static/ThinkPHP/date2.png"  />
				</picker>
            </view> 
            <view class="wuxing col">{{huangli.wuxing}}</view>
            <view class="yiji row">
                <view class="yi col">
                    <view class="key col text-green">宜</view>
                    <view class="content">{{huangli.yi}}</view>
                </view>
                <view class="ji col">
                    <view class="key col text-red">忌</view>
                    <view class="content col">{{huangli.ji}}</view>
                </view>
            </view>
            <view class="other">
                <view class="item row">
                    <view class="key">冲煞：</view>
                    <view class="val">{{huangli.chongsha}}</view>
                </view>
                <view class="item row">
                    <view class="key">彭祖百忌：</view>
                    <view class="val">{{huangli.baiji}}</view>
                </view>
                <view class="item row">
                    <view class="key">吉神宜趋：</view>
                    <view class="val">{{huangli.jishen}}</view>
                </view>
                <view class="item row">
                    <view class="key">凶神宜忌：</view>
                    <view class="val">{{huangli.xiongshen}}</view>
                </view>
            </view>
            <view class="bg-text lao">老</view>
            <view class="bg-text li">
                历
            </view>
        </view>
        <loading v-if="!is_req"></loading>
		
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
                huangli:{},
                is_req:false,
                date:"",
                page:"",
                isHome:0
			}
		},
		onLoad(opt) {
            this.page=opt.page
            this.isHome=opt.isHome

            let date= new Date()
            let day=date.toISOString().split("T")[0]
			this.initData(day)
		},
		methods: {
			async initData(time){
                let huangli=uni.getStorageSync(time)
                if (huangli) {
                    this.huangli=huangli
                    this.is_req=true
                }else{
                    const res=await uni.$request({
                        date:time
                    },"api/api/huangli")
                    if (res.code==200) {
                        uni.setStorageSync(res.data.yangli, res.data)
                        this.huangli=res.data
                        this.is_req=true
                    }
                }
				
            },
            DateChange(e){
                console.log(e);
                this.date=e.detail.value
                this.initData(e.detail.value)
            }
		}
	}
</script>

<style lang="scss">
	@import "./main";
</style>